<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="static/css/bootstrap.min.css">  
    <script src="static/js/jquery-3.6.0.min.js"></script>
    <script src="static/js/bootstrap.bundle.min.js"></script>
    <title>随机验证码</title>

</head>

<body>
    <div><button id='vercode'>随机验证码</button></div>
</body>

</html>



<script>

    $(function () {

        // 定义函数（利用event.data指定长度）
        function make_vercode(event) {
            let code = ''
            let selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z');
            for (let i = 0; i < event.data; i++) {
                let charIndex = Math.floor(Math.random() * selectChar.length)
                code += selectChar[charIndex]
            }
            $('#vercode').after('<p>' + code + '</p>');
            // $('#vercode').after(`<p>${code}</p>`);
            // console.log(code);
        }
        // 点击事件
        $('#vercode').click(4,make_vercode)


    });

</script>


